<?php
require_once ('config.php');
require_once ('utils/session.php');
require_once ('utils/logged_in.php');

$result = execute_query("SELECT facebookID FROM facebookUser WHERE drupaluid='%s'", $drupaluid);
$fbid = mysql_result($result, 0);
?>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="https://www.facebook.com/2008/fbml">
	<head>

		<!-- For use in Facebook -->
		<link rel="stylesheet" type="text/css" href="../css/jquery-ui-1.8.11.custom.css" />
		<link rel="stylesheet" type="text/css" href="../css/jquery-ui.override.css" />
		<link rel="stylesheet" type="text/css" href="../css/multiColumn.css" />
		<link rel="stylesheet" href="../css/menu_style.css" type="text/css" media="all" />
		<script type="text/javascript" src="../js/jquery-1.5.2.min.js"></script>
		<script type="text/javascript" src="../js/jquery-ui-1.8.11.custom.min.js"></script>
		<script type="text/javascript" src="../js/jquery.quicksand.js"></script>
		<script type="text/javascript" src="../js/jquery.easing.1.3.js"></script>
		<script type="text/javascript" src="../js/jquery.ezpz_tooltip.js"></script>
		<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>

		<script type="text/javascript"><!--

var sIDs = [];
var cnt = 0;

function getUserFriends() {
	FB.api(
		{
			method: 'fql.query',
			query: 'SELECT uid, name FROM user WHERE uid IN (SELECT uid2 FROM friend WHERE uid1 = <?=$fbid?>) AND is_app_user = 1'
		},
		// Start call back
		// Data2 is the response from the FQL.Query method that contains a set
		//	of {uid,name} which is the userid's and name's of the users facebook friends that are also using the untold facebook application
		function(data2) {
			var passIt = data2.length + "~";
			var ct = 0;
			for(ct=0;ct<data2.length;ct++) {
				passIt = passIt + data2[ct].uid + "~" +  data2[ct].name + "~";
			}
			$.post("../ajax/getTradeList.php", {da: passIt}, function(data){	document.getElementById('tradelist').innerHTML = data; });
			// send the data passIt under the key da to the getTradeList. This will contain the length of the set as well as the facebook userid's and facebook names.
			// getTradeList will return all the friends you can trade with. 
			}		
	);
} // End getUserFriends method

/*
 * This function is called if someone clicks on a person to trade with 
 * The uidIN is the facebook id of the person that corresponds to the user selected to trade with
 */
function loadCardsPlus(options, uidIN) {
	$.post(
		"../ajax/addCardsToTrade.php",
		{uid: uidIN, cards: document.passing.formvar.value},
		function(data) { // Most likely data = returned tradeID
			options = data; // Why does it take in options? It does not appear to use the parameter options other than to write over it.
			loadCards(options);
		}
	);

	myCards();
}
/* NEW FUNCTION
 * Function written to take in the facebookID of the user clicked on to trade with
 * Then pass this id to showFriendsCards.php to load the friends available cards to trade
 */
function tradeWithUser(test, facebookID) {
	document.passing.formvar.value = "";

	document.getElementById('your').style.fontWeight = 'normal';
	
	// WOULD NOT WORK IF ../ajax/showFriendsCards.php       WHY?
    var oldCards = $('.cards'); // check
	$.post("showFriendsCards.php", {friendFbID: facebookID},
		function(cardList) {
			var newCards = $(cardList);
			alert ("Card List = " + cardList); // Debug code
			newCards.attr('hidden', 'true');
			oldCards.quicksand
			(
				newCards.children('.card'),
				{
					duration: 700,
					attribute: 'id',
					easing: 'easeInOutQuad'
				},
				function()
				{
					oldCards.sortable({
						start: function() { isDragging = true; },
						stop: function() { isDragging = false; }
					});
					
				}
			);
		},
		'html'  
	);
	
}

function loadCards(options) {
	document.passing.formvar.value = "";

	document.getElementById('your').style.fontWeight = 'normal';

	getUserFriends();

	var link = "../ajax/showTradeCards.php?";
	//var link = "showTradeCards.php?";  THIS WILL NOT WORK 

	if(!options) {
		options="{}";
	} else {
		document.tradeInfo.tradeID.value = options; // pass in the tradeID 
		options = {tradeID: options}; // {key: data}
	}

	var oldCards = $('.cards');

	// send an http request passing the tradeID to the server at page ("../ajax/showTradeCards.php?")
	$.post(
		link,
		options,
		function(data) {
			//alert ("data: " + data);
			var newCards = $(data);
			newCards.attr('hidden', 'true');
			oldCards.quicksand(
				newCards.children('.card'),
				{
					duration: 700,
					attribute: 'id',
					easing: 'easeInOutQuad'
				},
				function() {
					//$(".cardImg").ezpz_tooltip({contentId:"example-content-1"});
					//oldCards.selectable();
					//oldCards.sortable({
					//	delay: 1000
					//});
					oldCards.selectable({
						stop: function() {
							sIDs.length=0;
							var result = $("#select-result").empty();
							$(".ui-selected.card", this).each(
								function() {
									var index = $(this).attr('id');
									result.append(" #" + (index));
		
									sIDs[cnt] = index;
									cnt = cnt +1;
								}
							);
							var j = 0;
							var toSend = "";
		
							for(j=0;j<sIDs.length;j++) {
								toSend = toSend + "~" + sIDs[j];
							}
							document.passing.formvar.value = toSend;
							cnt = 0;
						}
					});
					//updateCardClickBinding();
				}
			);
		},
		'html'
	);
}

function loadPersonCards(options) {
	document.passing.formvar.value = "";

	getUserFriends();

	var link = "../ajax/showPersonTradeCards.php?";

	var oldCards = $('.cards');

	// send http request to the server specified by link ("../ajax/showPersonTradeCards.php?";) passing the data (options) to the server. 
	// The callback function (taking in data) will only be called if the http request is successful.
	$.post( 
		link,
		options,
		function(data) {
			var newCards = $(data);
			newCards.attr('hidden', 'true'); // quicksand is a plugin - I think it is used for the card animations
			oldCards.quicksand(
				newCards.children('.card'),
				{
					duration: 700,
					attribute: 'id',
					easing: 'easeInOutQuad'
				},
				function() {
					//$(".cardImg").ezpz_tooltip({contentId:"example-content-1"});
					//oldCards.selectable();
					//oldCards.sortable({
					//	delay: 1000
					//});
					oldCards.selectable({
						stop: function() {
							sIDs.length=0;
							var result = $("#select-result").empty();
							$(".ui-selected.card", this).each(
								function() {
									var index = $(this).attr('id');
									result.append(" #" + (index));

									sIDs[cnt] = index;
									cnt = cnt +1;
								}
							);
							var j = 0;
							var toSend = "";

							for(j=0;j<sIDs.length;j++) {
								toSend = toSend + "~" + sIDs[j];
							}
							document.passing.formvar.value = toSend;
							cnt = 0;
						}
					});
					//updateCardClickBinding();
				}
			);
		},
		'html'
	);
}

$(function(){ // generic click event.
	$().click(function(e){
		e.preventDefault(); // Prevent from opening hyperlink
	});
});

function acceptTrade() {
	$.post(
		"../ajax/acceptTrade.php",
		{
			tradeID: document.tradeInfo.tradeID.value
		},
		function(data) {
			alert(data);
		}
	);
}

function denyTrade() {
	$.post(
		"../ajax/denyTrade.php",
		{
			tradeID: document.tradeInfo.tradeID.value
		},
		function(data) {
			//	alert(data);
		}
	);

	loadCards();

}

function myCards() {
	var uid = <?php echo $drupaluid ?>;
	var sendThis = {
		tradeID: + document.tradeInfo.tradeID.value,
		person: uid // sendThis is like an object, and sendThis.person = uid which is the drupaluid
	};
	document.getElementById('my').style.fontWeight = 'bold';
	document.getElementById('your').style.fontWeight = 'normal';
	loadPersonCards(sendThis);
}

function yourCards() {
	var sendThis = {
		tradeID: document.tradeInfo.tradeID.value,
		person: "notme" // The person is not the current facebook application user, but instead a friend they are trading with (I think)
	};
	document.getElementById('your').style.fontWeight = 'bold';
	document.getElementById('my').style.fontWeight = 'normal';
	loadPersonCards(sendThis);
}

-->
		</script>
	</head>
	<body>
		<div id="fb-root"></div>
		<script>
			// asynchronously loads Facebook Javascript SDK, then displays card/friends list.
			window.fbAsyncInit = function() {
				FB.init({
					appId  : <?=$APP_ID?>,
					status : true, // check login status
					cookie : true, // enable cookies to allow the server to access the session
					xfbml  : true  // parse XFBML
				});
				
				loadCards(); // automatically loads friends list.
			};
			
			(function() {
				var e = document.createElement('script');
				e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
				e.async = true;
				document.getElementById('fb-root').appendChild(e);
			}());
		</script>
		<div id="header">
			<img src="../images/newbannertest.png">
			</img>
		</div>
		<div class="colmask leftmenu">
			<div class="colright">
				<div class="col1wrap">
					<div class="col1">
						<div class="cardList">
							<span>
								<form name ="tradeInfo" action="#dummy" method="post">
									<input type="hidden" value="" name="tradeID">
									<a href="javascript:acceptTrade()">Accept The Trade</a>
									<a href="javascript:denyTrade()">Deny The Trade</a>
									<a id="my" href="javascript:myCards()">Cards You Will Trade</a>
									<a id="your" href="javascript:yourCards()">Cards You Will Get</a>
								</form>
							</span>
							<ul class="cards">
							</ul>
						</div>
						<div class="cardList">
							<ul class="cards2">
							</ul>
						</div>
					</div>
				</div>

				<div class="col2">
					<!--
					<form name="form">
					<input type="text" name="cardname" onkeypress="return keyPressed(event)" value = "<?php if($_GET["cardname"])echo $_GET["cardname"]; else echo "Card name"; ?>"/>
					<br />
					<input type="radio" name="cardtype" value="0" checked>All Types
					<br />
					<input type="radio" name="cardtype" value="1">Race
					<br />
					<input type="radio" name="cardtype" value="2">Aspect
					<br />
					<input type="radio" name="cardtype" value="3">Power
					<br />
					<p> <a class="search" href="#dummy"> Search </a> </p>
					</form>
					-->

					<form name ="passing" action="" method="post">
						<a href="javascript:loadCards({})">Show My Cards</a>
						<span id="tradelist">	Loading Friends...</span>
						<input type="hidden" name="formvar" value ="" />
					</form>
				</div>
			</div>

			<div>
				<div id="example-content-1">
					Tooltip content
				</div>

			</div>
		</div>

		<div id="dock">
			<ul id='menu'>
				<li class="button">
					<a href='../home.php/' >Home</a>
				</li>
				<li class="button">
					<a href='../myCollection.php/'  >My Collection</a>
				</li>
				<li class="button">
					<a href='../store.php/'  >Store</a>
				</li>
				<li class="button">
					<a class='current' href='../tradeHome.php/'  >Trading</a>
				</li>
				<li class="button">
					<a href='http://www.untoldthegame.com/forum'  target="_blank">Forums</a>
				</li>
				<li class="button">
					<a href='http://'  >Character Builder</a>
				</li>
				<li class="button">
					<a href='../help/I3_toc.php/'  target="_blank">Help</a>
				</li>
			</ul>
		</div><!-- End of Nav Div -->
		</div>
	</body>
</html>

